/* 
  使用 useState 声明状态 - 可以在函数组件内声明和改变状态
  语法： const [状态变量，更新状态的函数] = useState(初始值)
  步骤：
    1. 导入 useState钩子函数： 声明状态
    2. 调用函数
    3. 解构数组，获取：状态变量，和更新状态的函数
*/

import React, { useState } from 'react';

const App = () => {
  // count等同于类组件的this.state.count
  // handleCount等同于this.setState({count：新值})
  // const [状态变量, 更新状态变量的方法] = useState(100);
  const [count, handleCount] = useState(100);
  return (
    <div>
      {/* 展示状态值 */}
      <h3>我是APP——————{count}</h3>
      {/* 注意与setState的区别：setState({ count : this.state.count +1}) */}
      {/* handleCount() 调用传参，直接传递具体数据即可，不需要包裹成对象 */}
      <button onClick={() => handleCount(count + 1)}>点击+1</button>
      {/* 相当于class的this.handleCount */}
      {/* <button onClick={() => this.handleCount}>点我+1</button> */}
    </div>
  );
};

export default App;
